<!DOCTYPE html>
<html lang="en">
<head>
  <title>delhi</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
.ty
{font-size:20px;font-family:Arial Rounded MT;color:dodgerblue;}
li:hover
{font-size:20px;font-family:Arial Rounded MT;color:lightgreen;}
</style>

</head>
<body>
<font style="font-family: Segoe script;font-size: 80px;color:#8A2BE2;"><center><img src="d.jpg" height="90px" width="100px" align="center" />ilWaliDilli</center></font>
<nav class="navbar navbar-inverse ">
  <div class="container-fluid">
    <div class="collapse navbar-collapse" id="myNavbar">
      <ul class="nav navbar-nav">
<li><a href="#" >DilWaliDilli</a></li>
        <li><a href="delhi1.html" >About Delhi</a></li>
        <li><a href="delhi2.html">Tourist Places</a></li>
        <li class="dropdown">
          <a class="dropdown-toggle" data-toggle="dropdown" href="#" target="_blank">Accomodation <span class="caret"></span></a>
          <ul class="dropdown-menu">
            <li><a href="delhi3.html" >Luxury Hotels</a></li>
            <li><a href="delhi4.html" >Semi-luxury Hotels</a></li>
            <li><a href="delhi5.html" >Budget Hotels</a></li>
          </ul>
        </li>
       <li class="dropdown">
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">Transport <span class="caret">
    </span></a>
          <ul class="dropdown-menu">
            <li><a href="delhi6.html">Metro Rail</a></li>
            <li><a href="delhi7.html">City Bus</a></li>
            <li><a href="delhi8.html">Auto Rickshaw</a></li>
          <li><a href="delhi9.html" >Taxi</a></li>
          </ul>
        </li>
        <li class="dropdown">
          <a class="dropdown-toggle" data-toggle="dropdown" href="#" >Entertainment
 <span class="caret"> </span></a>
          <ul class="dropdown-menu">
            <li><a href="delhi12.html" >Art Gallery</a></li>
            <li><a href="delhi10.html" >Movie Theatre</a></li>
            <li><a href="delhi11.html">Auditorium</a></li>
          <li><a href="delhi13.html">Discotheques</a></li>
          </ul>
        </li>
</ul>
      <ul class="nav navbar-nav navbar-right">
        <li><a href="sign.html"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li>
        <li><a href="login.html"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
      </ul>
    </div>
  </div>
</nav>
<div class="container-fluid">
<div id="myCarousel" class="carousel slide" data-ride="carousel">
    <ol class="carousel-indicators">
      <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
      <li data-target="#myCarousel" data-slide-to="1"></li>
      <li data-target="#myCarousel" data-slide-to="2"></li>
<li data-target="#myCarousel" data-slide-to="3"></li>
<li data-target="#myCarousel" data-slide-to="4"></li>
<li data-target="#myCarousel" data-slide-to="5"></li>
<li data-target="#myCarousel" data-slide-to="6"></li>
    </ol>
    <div class="carousel-inner">
<div class="item active">
        <img src="lotus temple.jpg" alt="Los Angeles" style="width:100%;height:690px">
        <div class="carousel-caption">
          <h3>Lotus Temple</h3>
          <p>A treat to visit!</p>
        </div>
      </div>

<div class="item">
        <img src="Jama.jpg" alt="New York" style="width:100%;height:690px">
        <div class="carousel-caption">
          <h3>Jama Masjid</h3>
          <p>A holy place to visit!</p>
        </div>
      </div>

      <div class="item">
        <img src="red.jpg" alt="Chicago" style="width:100%;height:690px">
        <div class="carousel-caption">
          <h3>Red Fort</h3>
          <p>Symbol of Freedom!</p>
        </div>
      </div>
    
      <div class="item">
        <img src="akshardham.jpg" alt="New York" style="width:100%;height:690px">
        <div class="carousel-caption">
          <h3>Akshardham</h3>
          <p>Great fun!</p>
        </div>
      </div>

<div class="item">
        <img src="rash.jpg" alt="New York" style="width:100%;height:690px">
        <div class="carousel-caption">
          <h3>Rashtrapati Bhawan</h3>
          <p>Home of President!</p>
        </div>
      </div>


<div class="item">
        <img src="qutub minar.jpg" alt="New York" style="width:100%;height:690px">
        <div class="carousel-caption">
          <h3>Qutab Minar</h3>
          <p>Tallest Building!</p>
        </div>
      </div>

<div class="item">
        <img src="india gate.jpg" alt="New York" style="width:100%;height:690px">
        <div class="carousel-caption">
          <h3>India Gate</h3>
          <p>Historical Monument!</p>
        </div>
      </div>
  
    </div>

    <!-- Left and right controls -->
    <a class="left carousel-control" href="#myCarousel" data-slide="prev">
      <span class="glyphicon glyphicon-chevron-left"></span>
      <span class="sr-only">Previous</span>
    </a>
    <a class="right carousel-control" href="#myCarousel" data-slide="next">
      <span class="glyphicon glyphicon-chevron-right"></span>
      <span class="sr-only">Next</span>
    </a>
  </div>
</div>

</body>
</html>
